<template>
  <div class="bus-index page">
    <div class="top">
      <keep-alive>
        <router-view :key="new Date().getTime()"></router-view>
      </keep-alive>
    </div>
    <div class="bottom border-top-1px">
      <div class="item" @click="turn(item)" v-for="(item,index) in items" :key="index">
        {{item.name}}
      </div>
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex'
import { LEVELS } from '../../../const'
import { sumBus, sumBusLeave } from '@/api/apply'
export default {
  components: {},
  mounted () {
  },
  created () {
    this.type = this.$route.query.type
    this.$router.push(this.items[0].path)
    if (this.type == 0) {
      sumBusLeave(this.type).then(res => {
        this.count = res.data
      })
    } else {
      sumBus(this.type).then(res => {
        this.count = res.data
      })
    }
  },
  methods: {
    turn (item) {
      this.$router.replace({
        path: item.path
      })
    }
  },
  computed: {
    ...mapState({
      user: (state) => state.user
    }),
    items () {
      let applyPath = '/apply/bus/apply'
      let recordPath = '/apply/bus/list'
      if (this.type == 0) {
        applyPath = '/apply/bus/apply/leave'
        recordPath = '/apply/bus/list/leave'
      }
      const list = [{
        name: '我要' + this.typeEnum[this.type],
        path: applyPath
      }, {
        name: this.typeEnum[this.type] + '记录',
        path: recordPath + '?top=' + 0
      }
      ]
      const li = {
        name: this.typeEnum[this.type] + '审核(' + this.count + ')',
        path: recordPath + '?top=' + 1
      }
      if (this.user.levelId > LEVELS.BUS) {
        list.push(li)
      }
      return list
    }
  },
  data () {
    return {
      count: 0,
      type: 0,
      typeEnum: ['请假', '出差']
    }
  }
}
</script>

<style scoped lang="stylus">
  .bus-index
    display flex
    padding 0 0
    flex-direction column

    .top
      position relative
      overflow scroll
      flex 1

    .bottom
      flex 0 0 44px
      height 44px
      display flex
      align-items center
      justify-content center
      border-color #B9B7C0

      .item
        height 100%
        flex 1
        display flex
        align-items center
        justify-content center
        color: #55545d;
        dpr-font(16Px)

</style>
